<template>
  <div>

    <div>
      <van-nav-bar title="商品详情" left-text="返回" left-arrow @click-left="onClickLeft" />
    </div>
    <div class="tu">
      <img :src="shopdata.img1" alt="" />
      <h1>￥{{ shopdata.originprice }}</h1>
      <p>{{ shopdata.proname }}</p>
    </div>
    <myconent></myconent>
    <van-goods-action>
      <van-goods-action-icon icon="chat-o" text="客服" dot />
      <van-goods-action-icon icon="cart-o" text="购物车" badge="5" @click="fun()" />
      <van-goods-action-icon icon="shop-o" text="店铺" badge="12" />
      <van-goods-action-button type="warning" text="加入购物车" @click="addshop(str)" />
      <van-goods-action-button type="danger" text="立即购买" />
    </van-goods-action>
  </div>
</template>

<script>
import Vue from 'vue';
import { Dialog } from 'vant';
import myconent from "../../marao/homepage/myconent.vue";

import service from "../../../utils/service";
export default {
  components: {
    myconent,
    [Dialog.Component.name]: Dialog.Component,
  },
  data() {
    return {
      shopdata: {},
      str: ""
    };
  },
  mounted() {
    this.str = this.$route.params.mr
    service({
      url: `http://118.178.238.19:3001/api/pro/detail/${this.str}`,
      method: "get",

    }).then(res => {
      console.log();
      this.shopdata = res.data.data;

    })
    this.$forceUpdate();
  },
  methods: {
    fun() {
      this.$router.push("/mycar")
    },
    onClickLeft() {
      this.$router.go(-1)
    },
    addshop(str) {
      console.log("商品id", str);
      service({
        url: "http://118.178.238.19:3001/api/cart/add",
        method: "post",
        data: {
          num: 1,
          proid: str,
          userid: sessionStorage.getItem('userid')
        }
      }).then(res => {
        console.log(res);
        if (res.data.data == 0 || res.data.data == 1) {
          Dialog.alert({
            message: '加入购物车',
          }).then(() => {
            // on close
          });
        }
      })

    }
  },

};
</script>

<style scoped>
.tu h1 {
  color: red;
}

.tu img {
  width: 370px;
}
</style>